/**
 * @description 卖家权益
 */
import style from './styles/App.less';
import classnames from "classnames";
import React from 'react';
import EntryBase from "../Common/EntryBase";
const Fragment = React.Fragment;
import { Icon } from 'wd-mobile';

import { qa_list } from "api_xukaiyu/app/content";

import util from "commons/util";
let query = util.parseQueryString();

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            items: []
        }
    }
    componentDidMount() {
        qa_list({
            qaType: 6
        }).then(res => {
            this.setState({
                items: res.data
            })
        })
    }
    render() {
        return (
            <Fragment>
                <div className={classnames(style.main, "x-scroll-y")}>
                    {
                        this.state.items.map((item, index) => {
                            return (
                                <div className={style.item} key={index}>
                                    <div className={style.itemTitle} onClick={() => {
                                        const items = [...this.state.items];
                                        items[index].show = !items[index].show;
                                        this.setState({
                                            items: items
                                        })
                                    }}>
                                        <span dangerouslySetInnerHTML={{ __html: item.question.replace(/\n/g, '<br>') }}></span>
                                        <Icon rotate={!!item.show ? 90 : 270} className="x-icon-arrow-left" />
                                    </div>
                                    <div className={classnames(style.itemContent, {
                                        [style.itemContentShow]: !!item.show
                                    })}>
                                        <span dangerouslySetInnerHTML={{ __html: item.answer.replace(/\n/g, '<br>') }}></span>
                                    </div>
                                </div>
                            )
                        })
                    }
                </div>
                <div className={style.tab}>
                    <div className={style.tabWrapper}>
                        <div onClick={() => {
                            location.replace("./helpCenter.html#/Buyer");
                        }} className={classnames(style.tabItem)}><span>买家权益</span></div>
                        <div className={classnames(style.tabItem, style.tabItemActive)}><span>卖家权益</span></div>
                    </div>
                    <div className={style.tabShadow}></div>
                </div>
            </Fragment>
        )
    }
}

export default App;